<style lang="scss" scoped>
	@import '@/assets/css/variable';

	.message {
		width: 100%;
		background-color: $main-bgc-gray;
		min-height: 100%;
		font-size: 1.2rem;
		overflow-y: scroll;
		box-sizing: border-box;
		flex: 1;

		.list {
			padding: 1rem;
			$paddingSize: 0.8rem;

			.item {
				padding-top: $paddingSize;
				background-color: white;
				margin-bottom: 1rem;
				display: flex;
				flex-direction: column;
				justify-content: space-between;
				border-radius: 0.8rem;

				.line1 {
					display: flex;
					align-items: center;
					justify-content: space-between;
					padding: 0 $paddingSize;

					.line1Left {
						display: flex;
						align-items: center;

						.type {
							font-size: 1.5rem;
							color: $color1;
						}
					}

					.line1Right {
						&.time {
							color: $color3;
						}
					}
				}

				.line2 {
					&.title {
						color: $color2;
						padding: $paddingSize;
						line-height: 1.3em;
						font-size: 1.3rem;
					}
				}

				.line3 {
					display: flex;
					align-items: center;
					justify-content: space-between;
					color: $color2;
					border-top: 1px solid $border-c;
					padding: $paddingSize;
				}
			}
		}
	}
</style>
<template>
	<div class="message">
		<!-- <van-dropdown-menu>
			<van-dropdown-item :title="selectTimeTitle" ref="item">
				<van-datetime-picker v-model="currentDate" type="date" title="选择年月日" :min-date="minDate"
					:max-date="maxDate" :formatter="formatter" @confirm="confirm" @cancel="cancel" />
			</van-dropdown-item>
		</van-dropdown-menu> -->
		<!-- <van-cell title="选择时间段" :value="date" @click="show = true" is-link/>
		<van-calendar v-model="show" type="range" @confirm="onConfirm" :min-date="minDate" :max-date="maxDate"/> -->
		<div class="margT-l">
			<van-cell-group>
				<van-cell title="核销数量" :value="loadData.write_count" />
				<van-cell title="核销总金额(元)" :value="loadData.write_sum"  />
				<van-cell title="已完成数量" :value="loadData.com_count"  />
				<van-cell title="已完成总金额(元)" :value="loadData.com_sum" ></van-cell>
				<van-cell title="下单总金额" :value="loadData.order_sum" />
				<!-- <van-cell title="接口下单数量" value="50" />
				<van-cell title="接口下单总金额(元)" value="6600"></van-cell> -->
			</van-cell-group>
		</div>
		<div class="tabbar-height"></div>
	</div>
</template>

<script>
	// @ is an alias to /src
	import moment from 'moment'
	import {
		myMixins
	} from "@/assets/js/mixins.js"
	export default {
		name: "course",
		mixins: [myMixins],
		components: {},
		data() {
			return {
				date: '',
				show: false,
				selectTimeTitle: '筛选时间',
				minDate: new Date(2020, 10, 1),
				maxDate: new Date(2035, 10, 1),
				currentDate: new Date(),
				loadData:''
			}
		},
		created() {
			const _this = this;
			// this.userInfo = JSON.parse(localStorage.getItem('userInfo'))
			// if (!this.userInfo) {
			// 	this.$router.replace('/login')
			// }
			// this.getCode()
		},
		mounted() {
			// document.title = '活动管理'
			// this.messageList = this.$store.state.messageList
			// this.loading = false
			// this.finished = true
			// this.messageList[this.active] = []
			// this.NewsMovePage()
			this.getOrderItemall()
		},
		methods: {
			getOrderItemall() {
			  const params = {
			    merchant_id:localStorage.getItem('merchant_id')
			  }
			  this.$request.OrderItemall(params).then(res => {
			    this.loadData = res.data
			  })
			},
			formatDate(date) {
			  return `${date.getMonth() + 1}/${date.getDate()}`;
			},
			onConfirm(date) {
			  console.log("date",date)
			  const [start, end] = date;
			  this.show = false;
			  this.date = `${this.formatDate(start)} - ${this.formatDate(end)}`;
			},
			cancel() {
				this.$refs.item.toggle();
			},
			confirm(val) {
				this.selectTimeTitle = moment(val).format('YYYY-MM-DD')
				//console.log('this.currentDate',this.currentDate)
				this.$refs.item.toggle();
			},
			formatter(type, val) {
				if (type === 'year') {
					return `${val}年`;
				} else if (type === 'month') {
					return `${val}月`;
				} else if (type === 'day') {
					return `${val}日`;
				}
				return val;
			},
			onClickTabs(index) {
				console.log("onClickTabs", index)
				this.active = index
				if (index == 0) {
					//全部
					this.type_id = ''
				} else if (index == 1) {
					//课程消息
					this.type_id = 2
				} else if (index == 2) {
					//报名消息
					this.type_id = 3
				}
				this.messageList[this.active] = []
				this.NewsMovePage()
			},
			NewsMovePage() {
				const _this = this;
				let params = {
					user_id: 42 || this.userInfo.id,
					type_id: this.type_id,
					pageNo: _this.load[_this.active].pageNo,
					pageSize: _this.pageSize
				}
				console.log("params", params)
				_this.load[_this.active].loading = true
				_this.$request.NewsMovePage(params).then(res => {
					let data = (res.data && res.data.data) || []
					console.log("res", res)
					let list = _this.messageList[_this.active]
					list.push(...data)
					// if(res.data.totalCount==0){
					// 	list = []
					// }
					_this.messageList[_this.active] = list
					_this.$forceUpdate()
					console.log("_this.messageList", _this.messageList)
					console.log("_this.load[_this.active].pageNo", _this.load[_this.active].pageNo)
					if (_this.load[_this.active].pageNo >= (Math.ceil(res.data.totalCount / _this.pageSize))) {
						_this.load[_this.active].finished = true;
					} else {
						_this.load[_this.active].pageNo++
					}
				}).finally(() => {
					console.log('finally')
					_this.load[_this.active].loading = false
					// _this.load[_this.active].finished = true;
				})
			},
		}
	};
</script>
